<template>
  <div style="position: relative">
    <!-- <nav-bar
      title="标题"
      left-text="返回"
      right-text="按钮"
      left-arrow
      @click-left="onClickLeft"
      @click-right="onClickRight"
    /> -->
    <div class="nav-navbar">
      <div class="nav-navbar_1">
        <span
          class="fa fa-angle-left"
          style="font-size: 0.4rem; font-weight: bold; line-height: 0.8rem"
        ></span>
        <span style="font-size: 0.4rem; font-weight: bold">清空全部</span>
      </div>
      <div class="nav-center">最近浏览</div>
    </div>
    <div class="look-list">
      <tabs v-model:active="active">
        <tab v-for="index in 3" :title="'标签 ' + index">
          内容 {{ index }}
          <ul>
            <li class="looklist-noe">
              <img src="#" alt="照片" />
              <div class="looklist-content">
                <p class="title">商品标题</p>
                <div class="looklist-rote">
                  <rate
                    v-model="value"
                    allow-half
                    :size="40"
                    color="#ffd21e"
                    void-icon="star"
                    void-color="#eee"
                  />
                  <span>￥2元</span>
                  <p class="desc">商品描述</p>
                </div>
              </div>
            </li>
          </ul></tab
        >
        <!-- <tab title="团购">内容 2</tab>
        <tab title="内容">内容 3</tab> -->
      </tabs>
    </div>
  </div>
</template>
<script setup>
import { ref } from "vue";
import { Tab, Tabs, Card, Rate } from "vant";
const active = ref(0);
const value = ref(2.5);
</script>
<style></style>
